import React from 'react'
import PropTypes from 'prop-types'
import {Modal, Form, Input, Select, Avatar, Button, Tree, message} from 'antd';
import axios from "axios";
import api from "../../../../api/api";
const {Option} = Select;
const FormItem = Form.Item;
const {TreeNode} = Tree;

@Form.create()
class Model2 extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
            treeData: [],
            menuTreeCheckedList: [],
            visible: false,
        };
    }
    componentDidMount() {
        this.props.onRef(this)
        this.getMenuTree();
    }
    getMenuTree(){
        let that =this;
        let url = api.api_URL + "/admin/role/getMenuTree";
        let data={};
        axios.post(url, data, {
            headers: {
                "Content-Type": api.ContentType
            }
        }).then(function (res) {
            if (res.data.errorCode != 1) {
                alert("1")
                message.error({content:"失败，请重新尝试！"})
                return;
            }
            console.log(res.data.object)
            let dataList = [];
            for (let i = 0; i < res.data.object.menuTree.length; i++) {
                let resContent = res.data.object.menuTree[i];
                let content = {};
                content.key = resContent.id;
                content.title = resContent.menuName;
                let childContents = [];
                for (let j = 0; j < resContent.children.length; j++) {
                    let resChildContent = resContent.children[j];
                    let childContent = {};
                    childContent.key = resChildContent.id;
                    childContent.title = resChildContent.menuName;
                    childContents[j] = childContent;
                }
                content.children = childContents;
                dataList[i] = content;
            }
            console.info(dataList);
            that.setState({
                treeData: dataList
            })
            console.log(dataList);
            message.success({content:"成功！"})
            that.handleCancel();
        }).catch(function (err) {
            message.error({content:"失败，请重新尝试！"});
            console.log(err);
        });
    }

    handleOk = () => {
        let that = this;
        let url = api.api_URL + "/admin/role/addRoleMenu";
        let data={
            menuTreeCheckedList:this.state.menuTreeCheckedList,
            id:this.props.data.resource.id,//角色id
        };
        axios.post(url, data, {
            headers: {
                "Content-Type": api.ContentType
            }
        }).then(function (res) {
            console.log(res.data)
            if (res.data.errorCode != 1) {
                message.error({content:"失败，请重新尝试！"})
                return;
            }
            message.success({content:"成功！"})
            that.handleCancel()
        }).catch(function (err) {
            message.error({content:"失败，请重新尝试！"})
            console.log(err);
        });

    }

    handleCancel = e => {
        console.log(e);
        this.props.handleCancel()
        this.resource();
    };


    onSelect = (selectedKeys, info) => {
        console.log('selected', selectedKeys, info);
    };
    onCheck = (checkedKeys, info) => {
        let that = this;
        console.log('onCheck', checkedKeys);

        this.setState({
            menuTreeCheckedList: checkedKeys
        })
    };

    render() {

        // const treeData = [
        //     {
        //         title: treeData.title,
        //         key: treeData.key,
        //         children: [
        //             {
        //                 title: treeData.children.title,
        //                 key: treeData.children.key,
        //                 children: [
        //                     { title: '0-0-0-0', key: '0-0-0-0' },
        //                     { title: '0-0-0-1', key: '0-0-0-1' },
        //                     { title: '0-0-0-2', key: '0-0-0-2' },
        //                 ],
        //             },
        //             {
        //                 title: '0-0-1',
        //                 key: '0-0-1',
        //                 children: [
        //                     { title: '0-0-1-0', key: '0-0-1-0' },
        //                     { title: '0-0-1-1', key: '0-0-1-1' },
        //                     { title: '0-0-1-2', key: '0-0-1-2' },
        //                 ],
        //             },
        //             {
        //                 title: '0-0-2',
        //                 key: '0-0-2',
        //             },
        //         ],
        //     },
        //     {
        //         title: '0-1',
        //         key: '0-1',
        //         children: [
        //             { title: '0-1-0-0', key: '0-1-0-0' },
        //             { title: '0-1-0-1', key: '0-1-0-1' },
        //             { title: '0-1-0-2', key: '0-1-0-2' },
        //         ],
        //     },
        //     {
        //         title: '0-2',
        //         key: '0-2',
        //     },
        // ];


        return (
            <div>
            <Modal
                title={this.props.data.title}
                visible={this.props.data.visible}
                resource={this.props.data.resource}
                width={300}
                onOk={this.handleOk}
                onCancel={this.handleCancel}
            >
                <Tree
                    checkable
                    onSelect={this.onSelect}
                    onCheck={this.onCheck}
                    defaultExpandParent={true}
                    checkedKeys={this.state.menuTreeCheckedList}
                    treeData={this.state.treeData}
                    disabled={false}
                />
            </Modal>
            </div>
        );
    }

}

Model2.propTypes = {
    type: PropTypes.string,
    item: PropTypes.object,
    onOk: PropTypes.func,
}
export default Model2
